<?xml version="1.0" encoding="UTF-8"?>

<!--
    Document   : productDetail.xsl
    Created on : November 25, 2012, 3:12 PM
    Author     : minhsong
    Description:
        Purpose of transformation follows.
-->

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="html"/>

    <!-- TODO customize transformation rules 
         syntax recommendation http://www.w3.org/TR/xslt 
    -->
    <xsl:template match="/Product">
        <div class="ProductName">
            <xsl:value-of select="ProductName"/>
        </div>
        <div class="Datail">
            <div class="Image">
                <img style="width:200px;heigh:200px;">
                    <xsl:attribute name="src">
                        <xsl:value-of select="'images/'"/>
                        <xsl:value-of select="ProductImage"/>
                    </xsl:attribute>
                </img>
            </div>
            <div class="ProductInfo">
                <table>
                    <tbody>
                        <tr>
                            <td>
                                <xsl:value-of select="'Weight:'"/>
                            </td>
                            <td>
                                <xsl:value-of select="Weight"/>
                                <xsl:value-of select="'(gam)'"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <xsl:value-of select="'Height:'"/>
                            </td>
                            <td>
                                <xsl:value-of select="Height"/>
                                <xsl:value-of select="'(Cm)'"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <xsl:value-of select="'Long:'"/>
                            </td>
                            <td>
                                <xsl:value-of select="Long"/>
                                <xsl:value-of select="'(Cm)'"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <xsl:value-of select="'Wide:'"/>
                            </td>
                            <td>
                                <xsl:value-of select="Wide"/>
                                <xsl:value-of select="'(Cm)'"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <xsl:value-of select="'Price:'"/>
                            </td>
                            <td>
                                <xsl:value-of select="'$'"/>
                                <xsl:value-of select="Price"/>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </xsl:template>

</xsl:stylesheet>
